<template>
  <div class="main">
    <h1>封装 axios ，解决跨域</h1>
    <button @click="req1">get现金日记账所有</button>
  </div>
</template>

<script lang="ts">
import { defineComponent } from "vue";
import {
  noInstanceInterceptorsReq,
  withInstanceInterceptorsReq,
} from "@/service/index";
import { ResponseResult } from "@/service/index";

export default defineComponent({
  setup() {
    const req1 = () => {
      // 调用 noInstanceInterceptorsReq 只有全局拦截器 - 所有实例都会有的拦截器
      // 调用 withInstanceInterceptorsReq 有该实例专有的请求拦截器
      withInstanceInterceptorsReq
        .get<ResponseResult>({
          url: "/cash/selectAll",
          showLoading: false,
        })
        .then((res: ResponseResult) => {
          console.log(res);
        })
        .catch((err) => console.log(err));
    };

    return { req1 };
  },
});
</script>
<style scoped></style>